<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.org/ui"
                template="./../../resources/templates/baseTemplate.xhtml">

    <ui:define name="content">
        <f:view id="vRoot">
            <h:outputScript library="scripts" name="primefaces-locale.js"/>
            <p:fieldset legend="Gerenciar eventos">

                <h:form id="frmEventos">
                    <!-- Exibição de mensagens gerais -->
                    <p:growl id="gMessages" sticky="false" globalOnly="true" />

                    <!-- Exibição dos eventos no componente Scheduler -->
                    <p:commandButton id="cbNovoEvento" 
                                     value="Novo" 
                                     type="button" 
                                     onclick="dlgNovo.show();" 
                                     icon="ui-icon-circle-plus"
                                     styleClass="botao">
                        <f:ajax execute="@this" render="@form" />
                        <f:actionListener type="org.omnifaces.eventlistener.ResetInputAjaxActionListener" />
                    </p:commandButton>

                    <p:schedule value="#{eventoBean.eventos}" 
                                widgetVar="schEventos" locale="pt">
                        <p:ajax event="eventSelect" 
                                listener="#{eventoBean.eventoSelecionado}" 
                                update=":frmEditar" 
                                oncomplete="dlgEditar.show()" />
                        <p:ajax event="dateSelect" 
                                listener="#{eventoBean.dataSelecionada}" 
                                update=":frmEventos :frmNovo"
                                oncomplete="dlgNovo.show();"/>
                    </p:schedule>
                </h:form>

                <!-- Caixa de diálogo de inclusão de eventos -->
                <p:dialog id="dlgNovoEvento" 
                          widgetVar="dlgNovo" 
                          modal="true" 
                          header="Novo evento"
                          resizable="false" 
                          draggable="true">

                    <h:form id="frmNovo">
                        <p:panelGrid columns="1" styleClass="gridNoLine">

                            <p:row>
                                <p:messages id="mNovoMessages" redisplay="false"/>
                            </p:row>

                            <!-- Linha 1 -->
                            <p:panelGrid columns="2" styleClass="gridNoLine">
                                <h:outputLabel value="Nome:" />
                                <p:inputText value="#{eventoBean.nome}"
                                             required="true"
                                             requiredMessage="Digite o nome do evento."/>
                            </p:panelGrid>

                            <!-- Linha 2 -->
                            <p:panelGrid columns="2" styleClass="gridNoLine">
                                <h:outputLabel value="Tipo de evento:" />
                                <p:selectOneMenu value="#{eventoBean.tipoEventoSelecionado}" 
                                                 effect="fade" 
                                                 converter="#{eventoBean.conversorTipoEvento}" 
                                                 required="true" 
                                                 requiredMessage="Selecione um tipo do evento.">

                                    <f:selectItem itemLabel="Selecione um item..." itemValue=""/>
                                    <f:selectItems value="#{eventoBean.tiposEvento}" var="atual" itemLabel="#{atual.nmeTipoEvento}" itemValue="#{atual}"></f:selectItems>
                                </p:selectOneMenu>
                            </p:panelGrid>

                            <!-- Linha 3 -->
                            <p:row>
                                <p:panelGrid columns="2">
                                    <h:outputLabel value="Descrição:" />
                                    <p:inputTextarea value="#{eventoBean.descricao}"
                                                     required="true"
                                                     requiredMessage="Digite a descrição do evento."/>
                                </p:panelGrid>
                            </p:row>

                            <!-- Linha 4 -->
                            <p:panelGrid columns="2">
                                <h:outputLabel value="Data de início:" />
                                <p:calendar id="calNovoInicio" 
                                            value="#{eventoBean.dataInicio}" 
                                            showOn="button"
                                            locale="pt" 
                                            required="true"
                                            requiredMessage="Selecione a data de início do evento."
                                            pattern="dd/MM/yyyy HH:mm"
                                            stepMinute="10">

                                    <p:ajax event="dateSelect" listener="#{eventoBean.dataMinAlterada}" 
                                            update="@this :frmNovo:calNovoTermino :frmEventos:gMessages" /> 
                                </p:calendar>
                                <h:outputLabel value="Data de término:" />
                                <p:calendar id="calNovoTermino"
                                            value="#{eventoBean.dataTermino}" 
                                            showOn="button"
                                            locale="pt"
                                            required="true"
                                            requiredMessage="Selecione a data de término do evento."
                                            mindate="#{eventoBean.dataInicio}"
                                            pattern="dd/MM/yyyy HH:mm"
                                            stepMinute="10">

                                    <p:ajax event="dateSelect" listener="#{eventoBean.dataMaxAlterada}" 
                                            update="@this :frmNovo:calNovoInicio :frmEventos:gMessages" /> 
                                </p:calendar>
                            </p:panelGrid>

                            <!-- Linha 6 -->
                            <p:panelGrid columns="2">
                                <p:selectCheckboxMenu label="Público alvo" value="#{eventoBean.lstPublicoAlvo}">
                                    <f:selectItems value="#{eventoBean.publicosAlvo}"/>
                                </p:selectCheckboxMenu>
                            </p:panelGrid>

                            <!-- Linha 7 -->
                            <p:row>
                                <p:commandButton value="Cancelar"
                                                 immediate="true"
                                                 onclick="dlgNovo.hide();"/>

                                <p:commandButton id="cbNovoSalvar" 
                                                 value="Salvar" 
                                                 actionListener="#{eventoBean.cadastrarEvento}"
                                                 oncomplete="handleSalvo(xhr, status, args);" 
                                                 update=":frmEventos :frmNovo"
                                                 ajax="true"/>
                            </p:row>
                        </p:panelGrid>
                    </h:form> 
                </p:dialog>
                <!-- Caixa de diálogo de edição -->
                <p:dialog widgetVar="dlgEditar" 
                          modal="true" 
                          header="Editar evento"
                          resizable="false" 
                          draggable="true">
                    <h:form id="frmEditar">
                        <p:commandButton id="cbEditarExcluir" 
                                         actionListener="#{eventoBean.excluirEvento}"
                                         update=":frmEventos"
                                         oncomplete="dlgEditar.hide();"
                                         value="Excluir"/>
                    </h:form>
                </p:dialog>
            </p:fieldset>   
        </f:view>

        <script type="text/javascript">
            function handleSalvo(xhr, status, args){
                if(args.salvo){
                    dlgNovo.hide();
                }
            }
            function handleEditar(xhr, status, args){
                if(args.salvo){
                    dlgEditar.hide();
                }
            }
        </script>
    </ui:define>

</ui:composition>
